

:root,
:root .aie-theme-light {
  --aie-text-color: #333;
  --aie-text-placeholder-color: #adb5bd;
  --aie-bg-color: #fff;
  --aie-container-border:#e9e9e9;
  --aie-pre-bg-color:#fafafa;
  --aie-blockquote-bg-color:#fafafa;
  --aie-blockquote-border-color:#e3e3e3;
  --aie-blockquote-text-color:#888888;
  --aie-dropdown-container-bg-color:#ffffff;
  --aie-dropdown-container-border-color:#e9e9e9;
  --aie-dropdown-container-item-hover-color: #efefef;
  --aie-dropdown-color-panel-title-color: #666;
  --aie-dropdown-color-panel-button-border-color:#e3e3e3;
  --aie-suggestion-selected-border-color:#e3e3e3;
  --aie-suggestion-selected-bg-color:#e3e3e3;
  --aie-menus-text-color:var(--aie-text-color);
  --aie-menus-bg-color:#ffffff;
  --aie-menus-svg-color:#353535;
  --aie-menus-item-hover-color:#eee;
  --aie-menus-divider-color:#eaeaea;
  --aie-menus-ai-bg-color:var(--aie-menus-svg-color);
  --aie-menus-ai-color:#ffffff;
  --aie-menus-tip-bg-color: #333;
  --aie-menus-tip-text-color:#eee;
}


//the dark theme variables
:root .aie-theme-dark {
  --aie-text-color: #ccc;
  --aie-text-placeholder-color: #5d5d5d;
  --aie-bg-color: #1e2022;
  --aie-container-border:#333;
  --aie-pre-bg-color:#282c34;
  --aie-blockquote-bg-color:#fafafa;
  --aie-blockquote-border-color:#e3e3e3;
  --aie-blockquote-text-color:#888888;
  --aie-dropdown-container-bg-color: #505050;
  --aie-dropdown-container-border-color: #606060;
  --aie-dropdown-container-item-hover-color: #696969;
  --aie-dropdown-color-panel-title-color: #ccc;
  --aie-dropdown-color-panel-button-border-color: #606060;
  --aie-suggestion-selected-border-color:#444;
  --aie-suggestion-selected-bg-color:#444;
  --aie-menus-text-color:var(--aie-text-color);
  --aie-menus-bg-color:#1a1b1e;
  --aie-menus-svg-color: #cccccc;
  --aie-menus-item-hover-color:#333;
  --aie-menus-divider-color:#2c2c2c;
  --aie-menus-ai-bg-color:var(--aie-menus-svg-color);
  --aie-menus-ai-color:#000;
  --aie-menus-tip-bg-color: #eee;
  --aie-menus-tip-text-color:#333;
}